

<template>
  <!-- 
     读卡 读不到只能新建 所以输入没有必要
     读卡  读到了  就只能修改了
     所以输入是没有必要的
-->
  <div class="addUpdate">
    
    <ViewTitle text="病人信息" />
    <div class="box1">
     

       <div class="yisheng">
        <span>病人姓名:</span>
        <el-input
         size="mini"
         :value="backNumberData.member_info.name"
          disabled
          ></el-input>
      </div>
      <div>
        <span>卡号:</span>
        <el-input
          size="mini"
          disabled
            :value="backNumberData.member_info.id_card"
        
          placeholder="请输入卡号"
        ></el-input>
      </div>
      <div>
        <span>性别:</span>
         <el-input
               :value="$baseBai['gender'][backNumberData.member_info.gender-1].label"
          size="mini"
          disabled></el-input>
      </div>
      <div>
        <span>年龄:</span>
        <el-input
          disabled
          :value="backNumberData.member_info.age"
          size="mini"
          type="number"
       
        
        ></el-input>
      </div>
        <div>
        <span>科室:</span>
        <el-input
          disabled
          :value="backNumberData.doctor_info.dept_name"
          size="mini"
         
       
         
        ></el-input>
      </div>
    <div>
        <span>医生:</span>
        <el-input
          disabled
          :value="backNumberData.doctor_info.real_name"
          size="mini"
        
       
      
        ></el-input>
      </div>
      <div>
        <span>家庭住址:</span>
        <el-input
          disabled
          :value="backNumberData.member_info.address"
          size="mini"
         
          placeholder="请输入家庭住址"
        ></el-input>
      </div>
        <!-- <div>
        <span>病人性质:</span>
             <el-input
               :value="$baseBai['member_type'][backNumberData.member_type].label"
          size="mini"
          disabled></el-input>
     
      </div> -->
         <div>
        <span>病人性质:</span>

        <el-select
          size="mini"
          disabled
          v-model="backNumberData.member_type"
          placeholder="请选择病人性质"
        >
          <el-option
            v-for="(item, index) in dict_member_type"
            :key="'index3' + index"
            :label="item.name"
            :value="item.id"
          >
          </el-option>
        </el-select>
      </div>
       <div>
        <span>挂号时间:</span>
             <el-input
               :value="backNumberData.created_at" 
          size="mini"
          disabled></el-input>
     
      </div>
    </div>

    <ViewTitle text="退费信息" v-if="backNumberData.fee_items.length>0" />
    <div class="box3" v-if="backNumberData.fee_items.length>0" >
      <table>
        <el-table
          border
          height="250"
            disabled
          :data="backNumberData.fee_items"
          style="width: 100%"
        >
       
          <el-table-column prop="id" label="序号" width="50">
          </el-table-column>
          <el-table-column prop="name" label="项目" width="180">
          </el-table-column>
          <el-table-column prop="price" label="金额" width="180">
          </el-table-column>
        </el-table>
      </table>
    </div>
    
  
    <div class="box1" style="padding-top: 0">
       <div>
        <span>应退金额:</span>
        <el-input
          size="mini"
          disabled
          v-model="backNumberData.amount"
          placeholder="请输入"
        ></el-input>
      </div>
      <!-- <div>
        <span>应收:</span>
        <el-input
          size="mini"
          disabled
          v-model="backNumberData.should_amount"
          placeholder="请输入"
        ></el-input>
      </div>
      <div>
        <span>抹零:</span>
        <el-input
          size="mini"
          disabled
          v-model="backNumberData.erase_amount"
          placeholder="请输入"
        ></el-input>
      </div>
      <div>
        <span>收费:</span>
        <el-input
          size="mini"
          disabled
          v-model="backNumberData.amount"
          placeholder="请输入"
        ></el-input>
      </div>
      <div>
        <span>收银:</span>
        <el-input
          size="mini"
          disabled
          v-model="backNumberData.collect_amount"
          placeholder="请输入"
        ></el-input>
      </div>
      <div>
        <span>找零:</span>
        <el-input
          size="mini"
          disabled
          v-model="backNumberData.give_amount"
          placeholder="请输入"
        ></el-input>
      </div> -->
     
      
  
    </div>
   <ViewTitle text="退费方式："  />
  <div style="margin-top:20px">
    
           <el-table
           border
              :data="paymentArry"
              
              style="width: 100%">
           
             
                <el-table-column
                type="index"
                width="50"
                label="序号">
              
              </el-table-column>
              <el-table-column
                prop="label"
                label="支付方式"
                 width="100"
               >
              </el-table-column>
              <el-table-column
                prop="price"
                label="金额"
                 width="400"
                >
               <template slot-scope="scope">
                    <span>{{scope.row.price}}</span>
                
               </template>

            


              </el-table-column>
             
            </el-table>
      </div>
    <div style="text-align:center">
        
        <el-button type="success" style="width:200px" @click="backPrice()">点击退费</el-button>

    </div>
   
  </div>
</template>
<script>
import ViewTitle from "@/forComponents/viewTitle/index.vue";
import addUserInfo from "./addUserInfo.vue";
import { mapState,mapActions } from "vuex";
export default {
  props: ["backNumberData",'thatF'],
  data() {
    return {
     
      paymentArry:[],
      params: {
      
      },

    };
  },
  mounted(){

    // this.$baseBai['payment'].forEach(v=>{
      
    //   if(this.thatF.chargeData.payment==v.value){
       
    //       this.paymentArry=[v];
    //   }

     
    // })
      this.paymentArry=JSON.parse(JSON.stringify(this.$baseBai['payment'])),

    console.log("this.thatF.chargeData",this.thatF.chargeData)
    // this.paymentArry.splice(4,1)
    this.paymentArry.forEach(v=>{
       v.price=0;
      if(this.thatF.chargeData.payment){
       
      
          if(  this.thatF.chargeData.payment==v.value){
              v.price=  this.thatF.chargeData.amount;
          }
  
      }

     
    })
      
  },
   computed: {
    ...mapState({
    
      dict_member_type:state => state.dictBai.dict_member_type,
    }),
  },
  methods: {
   
   backPrice(){

      
       this['_API'].getRegisterBack({id:this.backNumberData.id}).then(res=>{


              if(res.code==200){
                    this.thatF.show_backNumber=false;
                    this.thatF.thatF.getList();
                    this.thatF.thatF.params.page=1;
                          this.$message({
                                message: res.message,
                                type: 'success'
                            });
                           
                    }
       })
   },
  },
  components: {
    ViewTitle,
    addUserInfo,
    //  FormInfo
  },
};
</script>
<style lang='scss' scoped>
.addUpdate {
  padding: 0 5%;
  .box1 {
    display: flex;
    flex-wrap: wrap;
    padding: 20px 0;
    > div {
      position: relative;
      width: 33%;
      display: flex;
      align-items: center;
      // justify-content: center;
      margin-bottom: 20px;

      > span {
        display: inline-block;
        width: 65px;
      }
      /deep/ .el-input {
        width: 200px;
      }
    }
  }
  .box3 {
    margin: 20px 0;
  }

  .dukaBut {
    margin: 0px 0 20px;
  }
}
/deep/ .el-dialog__body {
  height: 70vh;
  overflow: scroll;
}
  // /deep/ .el-table .success-row {
  //   background: #02bf6b;
  // }

  /deep/  .el-table .warning-row {
    background: red;
  }

 /deep/   .el-table .success-row {
    background: #02bf6b;
  }

  /deep/  .icon-add-bai{
        position: absolute;
    right: -32px;
    top: 50%;
    transform: translateY(-50%);
  }
</style>